<template>
    <ol class="breadcrumb" style="margin-bottom: 10px;">
        <li>
            <a @click="handleNavClick(null,$event)">
                <i class="fa fa-th-large"></i>
            </a>
        </li>

        <li v-for="($item , index) in nav " :key="index">
            <a @click="handleNavClick($item['url'],$event)">
                {{ $item['name'] }}
            </a>
        </li>
    </ol>
</template>

<script>
    export default {
        name   : "media-breadcrumb",
        props: ['nav'],
        data() {
            return {};
        },
        methods: {
            handleNavClick(path = null, event) {
                event.preventDefault();

                console.log('path :', path);
                if (!path) {
                    path = '/'
                } else {
                    path = new URL(path).searchParams.get("path");
                }
                console.log('path :', path);
                this.$emit('mapLoadList' ,path);
            },
        },
    }
</script>

<style scoped lang="less">

</style>
